import { ProCard } from "@ant-design/pro-components";
import { Space, Typography } from "antd";
import React from "react";
import CardBg from "@/assets/card_bg.svg";

const WelcomeUser: React.FC<{ colSpan?: number }> = ({ colSpan = 24 }) => {
	return (
		<ProCard
			colSpan={colSpan}
			bodyStyle={{
				background: `url(${CardBg}) no-repeat`,
				backgroundPosition: "center",
				borderRadius: "6px",
				backgroundSize: "150%"
			}}
		>
			<Space align="center">
				<Typography.Title style={{ marginBottom: "0px", color: "white" }} level={4}>
					Hi，Herther
				</Typography.Title>
				<Typography style={{ marginTop: 6, color: "white" }}>下午好，今天是你加入的第 100 天～ </Typography>
			</Space>
		</ProCard>
	);
};
export default WelcomeUser;
